<template>
  <div class="app-container report">
    <el-form inline>
      <el-row :gutter="10" class="mb8">
        <el-col :span="24">
          <el-form-item label="检验日期:">
            <Date-picker
              type="date"
              placeholder="选择日期"
              style="width: 120px"
              v-model="queryParams.xjtDateBegin"
              @on-change="get_date($event, 's')"
            ></Date-picker>
            —
            <Date-picker
              type="date"
              placeholder="选择日期"
              style="width: 120px"
              v-model="queryParams.xjtDateEnd"
              @on-change="get_date($event, 'e')"
            ></Date-picker>
          </el-form-item>
          <el-form-item label="机台编号:">
            <el-select filterable clearable v-model="queryParams.xjtJtbh">
              <el-option
                v-for="item in listJtmJtbh"
                :key="item"
                :label="item"
                :value="item"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="客户编码:">
            <HdSelectMaterial
              v-model="queryParams.xjtCustwldm"
              keyName="itmCustwldm"
            />
          </el-form-item>
          <el-form-item>
            <Button type="info" style="display: inline-block" @click="getList"
              >查询</Button
            >
          </el-form-item>
          <el-form-item>
            <Button
              type="info"
              style="display: inline-block"
              :loading="exportLoading"
              @click="handleExport"
              >导出</Button
            >
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <div style="position: relative">
      <div style="position: absolute; right: 0; top: -30px">
        <Page
          :total="total"
          :current.sync="queryParams.pageNum"
          simple
          :page-size="queryParams.pageSize"
          show-elevator
          @on-change="pageChange"
        ></Page>
      </div>
      <el-table
        id="NoPlanAssign"
        border
        stripe
        :data="xjtData"
        highlight-current-row
        :header-cell-style="{ 'text-align': 'center' }"
      >
        <el-table-column label="#" width="40" type="index" align="center" />
        <el-table-column
          label="机台编号"
          :show-overflow-tooltip="true"
          width="150"
          align="center"
          prop="xjtJtbh"
        />
        <el-table-column
          label="检验日期"
          :show-overflow-tooltip="true"
          width="100"
          align="center"
          prop="xjtJyrq"
        />
        <el-table-column
          label="班次代码"
          :show-overflow-tooltip="true"
          width="100"
          align="center"
          prop="xjtBbdm"
        />
        <!--        <el-table-column label="巡检时段" :show-overflow-tooltip="true" width="100" align="center" prop="xjtXjrq"/>-->
        <el-table-column
          label="客户编码"
          :show-overflow-tooltip="true"
          width="150"
          align="center"
          prop="xjtCustwldm"
        />
        <el-table-column
          label="物料品名"
          :show-overflow-tooltip="true"
          width="250"
          align="center"
          prop="xjtWlpm"
        />
        <el-table-column
          label="操作"
          align="center"
          width="100"
          class-name="small-padding fixed-width"
        >
          <template #default="scope">
            <el-button size="mini" type="text" @click="handleUpdate(scope.row)"
              >查看</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>

    <el-dialog v-model="open" fullscreen width="100%" class="myDialog">
      <h1 style="text-align: center">武汉衡德注塑车间巡检表</h1>
      <div style="float: right">
        <span>日期：</span>
        <span style="margin-right: 15px">{{ xjtDataRow.xjtJyrq }}</span>
        <span>班次：</span>
        <span>{{ xjtDataRow.xjtBbdm }}</span>
      </div>
      <el-table
        :data="tableData"
        style="width: 100%; font-size: 12px"
        :header-cell-style="{ 'text-align': 'center', padding: '2px' }"
        :cell-style="{ padding: '2px 2px' }"
        border
        cell-class-name="table__cell"
        :height="tableH"
      >
        <el-table-column
          label="序号"
          type="index"
          align="center"
          width="40"
        ></el-table-column>
        <el-table-column
          label="机台"
          align="center"
          prop="xjtJtbh"
          width="70"
        ></el-table-column>
        <el-table-column
          label="物料编码"
          align="center"
          prop="xjtCustWldm"
          width="135"
        ></el-table-column>
        <el-table-column
          label="检查产品有无飞边毛刺、料花、缩水、气纹、色纹、黑纹、变形、分层、缺料、划伤、黑点、杂质、熔接痕等外观不良现象。"
          align="center"
          width="350"
        >
          <el-table-column
            :label="hTime.H1"
            align="center"
            prop="xjtViewTen"
            width="50"
          ></el-table-column>
          <el-table-column
            :label="hTime.H2"
            align="center"
            prop="xjtViewZero"
            width="50"
          ></el-table-column>
          <el-table-column
            :label="hTime.H3"
            align="center"
            prop="xjtViewTwo"
            width="50"
          ></el-table-column>
          <el-table-column
            :label="hTime.H4"
            align="center"
            prop="xjtViewFour"
            width="50"
          ></el-table-column>
          <el-table-column
            :label="hTime.H5"
            align="center"
            prop="xjtViewSix"
            width="50"
          ></el-table-column>
        </el-table-column>
        <el-table-column label=" 色差值（填写E值）" align="center" width="250">
          <el-table-column
            :label="hTime.H1"
            align="center"
            prop="xjtColourTen"
            width="60"
          ></el-table-column>
          <el-table-column
            :label="hTime.H2"
            align="center"
            prop="xjtColourZero"
            width="60"
          ></el-table-column>
          <el-table-column
            :label="hTime.H3"
            align="center"
            prop="xjtColourTwo"
            width="60"
          ></el-table-column>
          <el-table-column
            :label="hTime.H4"
            align="center"
            prop="xjtColourFour"
            width="60"
          ></el-table-column>
          <el-table-column
            :label="hTime.H5"
            align="center"
            prop="xjtColourSix"
            width="60"
          ></el-table-column>
        </el-table-column>
        <el-table-column label=" 光泽度" align="center" width="250">
          <el-table-column
            :label="hTime.H1"
            align="center"
            prop="xjtLustre1"
            width="60"
          ></el-table-column>
          <el-table-column
            :label="hTime.H2"
            align="center"
            prop="xjtLustre2"
            width="60"
          ></el-table-column>
          <el-table-column
            :label="hTime.H3"
            align="center"
            prop="xjtLustre3"
            width="60"
          ></el-table-column>
          <el-table-column
            :label="hTime.H4"
            align="center"
            prop="xjtLustre4"
            width="60"
          ></el-table-column>
          <el-table-column
            :label="hTime.H5"
            align="center"
            prop="xjtLustre5"
            width="60"
          ></el-table-column>
        </el-table-column>
        <el-table-column
          label="材料、标识、装配性能及包装是否合格"
          align="center"
        >
          <el-table-column
            :label="hTime.H1"
            align="center"
            prop="xjtMaterialLogoTen"
            width="50"
          ></el-table-column>
          <el-table-column
            :label="hTime.H2"
            align="center"
            prop="xjtMaterialLogoZero"
            width="50"
          ></el-table-column>
          <el-table-column
            :label="hTime.H3"
            align="center"
            prop="xjtMaterialLogoTwo"
            width="50"
          ></el-table-column>
          <el-table-column
            :label="hTime.H4"
            align="center"
            prop="xjtMaterialLogoFour"
            width="50"
          ></el-table-column>
          <el-table-column
            :label="hTime.H5"
            align="center"
            prop="xjtMaterialLogoSix"
            width="50"
          ></el-table-column>
        </el-table-column>
        <el-table-column label="尺寸" align="center" width="120">
          <el-table-column label="标准尺寸一" align="center">
            <el-table-column label="标准尺寸二" align="center" width="120">
              <template #default="scope">
                <div class="divHeight">
                  <div
                    v-if="!isNaN(parseFloat(scope.row.xjtJccc1X).toFixed(2))"
                  >
                    {{ parseFloat(scope.row.xjtJccc1X).toFixed(2) }} ~
                    {{ parseFloat(scope.row.xjtJccc1S).toFixed(2) }}
                  </div>
                </div>
                <div style="height: 20px">
                  <div
                    v-if="!isNaN(parseFloat(scope.row.xjtJccc2X).toFixed(2))"
                  >
                    {{ parseFloat(scope.row.xjtJccc2X).toFixed(2) }} ~
                    {{ parseFloat(scope.row.xjtJccc2S).toFixed(2) }}
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
        </el-table-column>
        <!--            :prop="xjtJccc1X+ '~' + xjtJccc1S"-->
        <el-table-column label="实测尺寸" align="center" width="250">
          <el-table-column
            :label="hTime.H1"
            align="center"
            prop="xjtSizeoneCavoneTen"
            width="80"
          >
            <el-table-column label="穴数一" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavoneTen }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavoneTen }}
                  </div>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="穴数二" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavtwoTen }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavtwoTen }}
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column
            :label="hTime.H2"
            align="center"
            prop="xjtSizeoneCavoneZero"
            width="50"
          >
            <el-table-column label="穴数一" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavoneZero }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavoneZero }}
                  </div>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="穴数二" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavtwoZero }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavtwoZero }}
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column
            :label="hTime.H3"
            align="center"
            prop="xjtSizeoneCavoneTwo"
          >
            <el-table-column label="穴数一" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavoneTwo }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavoneTwo }}
                  </div>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="穴数二" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavtwoTwo }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavtwoTwo }}
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column
            :label="hTime.H4"
            align="center"
            prop="xjtSizeoneCavoneFour"
            width="50"
          >
            <el-table-column label="穴数一" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavoneFour }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavoneFour }}
                  </div>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="穴数二" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavtwoFour }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavtwoFour }}
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
          <el-table-column
            :label="hTime.H5"
            align="center"
            prop="xjtSizeoneCavoneSix"
            width="50"
          >
            <el-table-column label="穴数一" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavoneSix }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavoneSix }}
                  </div>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="穴数二" align="center" width="70">
              <template #default="scope">
                <div>
                  <div class="divHeight">
                    {{ scope.row.xjtSizeoneCavtwoSix }}
                  </div>
                  <div style="height: 20px">
                    {{ scope.row.xjtSizetwoCavtwoSix }}
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table-column>
        </el-table-column>
        <el-table-column label="标准重量" align="center">
          <el-table-column label="NA" align="center" width="100">
            <template #default="scope">
              <div>
                {{
                  parseFloat(scope.row.xjtJzX).toFixed(1) +
                  "~" +
                  parseFloat(scope.row.xjtJzS).toFixed(1)
                }}
              </div>
            </template>
          </el-table-column>
        </el-table-column>
        <!--            :prop="xjtJzX+ '~' + xjtJzS"-->
        <el-table-column
          label="实测"
          align="center"
          prop="xjtWeightoneCavoneTen"
          width="50"
        >
          <el-table-column label="穴数一" align="center" width="70">
            <template #default="scope">
              {{ scope.row.xjtWeightoneCavoneTen }}
            </template>
          </el-table-column>
          <el-table-column label="穴数二" align="center" width="70">
            <template #default="scope">
              {{ scope.row.xjtWeightoneCavtwoTen }}
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column
          label="备注"
          align="center"
          prop="xjtDescTen"
          width="150"
        >
          <template #default="scope">
            {{ scope.row.xjtDescTen }}
          </template>
        </el-table-column>
        <el-table-column
          label="检验员"
          align="center"
          prop="xjtJyryTenName"
          width="100"
        ></el-table-column>
      </el-table>
      <div slot="footer"></div>
    </el-dialog>
  </div>
</template>

<script>
import { parseTime } from "@/utils/ruoyi";
import {
  listXjtDataForReport,
  listXjtDataForReportDetail,
  saveDetailNowDayByUniversal,
  exportTable,
} from "@/api/quality/productBom";
import mixins from "@/mixins/common";

export default {
  name: "ProductBomRecordReport",
  mixins: [mixins.listJtmJtbh],
  data() {
    return {
      exportLoading: false,
      //外部数据表格
      xjtData: [],
      xjtDataRow: [],
      tableData: [],
      tableData2: [],
      title: "",
      tableH: document.body.clientHeight - 200,
      open: false,
      //当前时间
      nowTime: "",
      check_search: false,
      tt_s: new Date(new Date().getTime() - 86400 * 30000),
      tt_e: new Date(new Date().getTime() + 86400 * 60000),
      total: 0,
      queryParams: {
        pageNum: 1,
        pageSize: document.body.clientHeight > 900 ? 25 : 17,
        xjtType: "E",
        xjtDateBegin: this.getTime(new Date().getTime() - 86400 * 30000).slice(
          0,
          10
        ),
        xjtDateEnd: this.getTime(new Date().getTime() + 86400 * 60000).slice(
          0,
          10
        ),
      },
      timeDay: null,
      hTime: {
        H1: "H1",
        H2: "H2",
        H3: "H3",
        H4: "H4",
        H5: "H5",
      },
      options: [
        {
          value: "√",
          label: "√",
        },
        {
          value: "×",
          label: "×",
        },
      ],
    };
  },
  created() {
    this.getList();
  },
  methods: {
    getList() {
      this.queryParams.xjtDateBegin = this.moment(
        this.queryParams.xjtDateBegin
      ).format("YYYY-MM-DD");
      this.queryParams.xjtDateEnd = this.moment(
        this.queryParams.xjtDateEnd
      ).format("YYYY-MM-DD");

      listXjtDataForReport(this.queryParams).then((res) => {
        this.xjtData = res.rows;
        this.total = res.total;
      });
    },
    handleUpdate(row) {
      this.xjtDataRow = row;
      this.timeDay = row.timeDay;
      //当前时间段
      this.nowTime = row.timeDay;
      this.open = true;
      //请求数据,按照机台编号,
      let objAdd = {
        xjtBbdm: row.xjtBbdm,
        xjtJyrq: row.xjtJyrq,
        xjtType: "E",
        xjtXjrq: row.xjtXjrq,
        xjtId: row.xjtId,
      };
      listXjtDataForReportDetail(objAdd).then((res) => {
        this.tableData = res.data.map((o) => {
          if (o.xjtInformation) {
            let obj = JSON.parse(o.xjtInformation);
            o = Object.assign(o, obj);
          }
          return o;
        });
      });
    },
    handleSave(row) {
      row.xjtJyryTen = this.$store.getters.name;
      switch (this.timeDay) {
        case "H1":
          row.xjtAnalyzeTen = new Date();
          row.xjtFlagTen = "1";
          break;
        case "H2":
          row.xjtAnalyzeZero = new Date();
          row.xjtFlagZero = "1";
          break;
        case "H3":
          row.xjtAnalyzeTwo = new Date();
          row.xjtFlagTwo = "1";
          break;
        case "H4":
          row.xjtAnalyzeFour = new Date();
          row.xjtFlagFour = "1";
          break;
        case "H5":
          row.xjtAnalyzeSix = new Date();
          row.xjtFlagSix = "1";
          break;
      }
      saveDetailNowDayByUniversal(row).then((res) => {
        this.getList();
      });
    },
    cancel() {
      this.open = false;
    },
    get_date(e, type) {
      if (type === "s") {
        this.queryParams.xjtDateBegin = e;
      } else if (type === "e") {
        this.queryParams.xjtDateEnd = e;
      }
    },
    getTime(time = new Date()) {
      return parseTime(time);
    },
    pageChange(page) {
      this.queryParams.pageNum = page;
      this.getList();
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams;
      this.exportLoading = true;
      return exportTable(queryParams).then((response) => {
        this.download(response.msg);
        this.exportLoading = false;
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.report {
  input {
    width: 60px;
  }

  table {
    width: 100%;
    height: 50px;
    border-spacing: 0;
    border-collapse: collapse;
    text-align: center;
    font-weight: bold;
  }

  table td {
    height: 40px;
    width: 82px;
    border: 1px solid black;
  }

  .xjTable {
    width: 100%;
    text-align: center;
    font-size: 24px;
    height: 48px;
    font-weight: bold;
  }

  .hdLogo {
    position: absolute;
    left: 34px;
    bottom: 8px;
    width: 130px;
    height: 58px;
  }

  .xjOrder {
    position: absolute;
    right: 70px;
    bottom: 2px;
    font-weight: bold;
    font-size: 16px;
  }

  .myDialog {
    ::v-deep .el-table thead th {
      height: 30px;
      font-size: 12px;
      padding: 0px 0px 0px 0px;
      color: #47494e;
      background: #f8f8f8 !important;
    }
    ::v-deep .el-table td .cell {
      height: 100%;
    }
    ::v-deep .el-select .el-input .el-input__suffix .el-input__suffix-inner {
      display: none;
    }

    ::v-deep .el-table__body-wrapper .el-select .el-input .el-input__inner {
      text-align: center;
    }
    /*z*/
    ::v-deep .el-input__inner {
      padding: 0;
      height: 23px;
      line-height: 23px;
      color: #000;
    }
    ::v-deep .inputWidth {
      width: 50px;
    }

    ::v-deep .divHeight {
      border-bottom: 1px solid #868686;
      height: 20px;
    }
    ::v-deep .demoColor input {
      background: #ffb3a7 !important;
    }
  }
}
</style>
